<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib uri="http://displaytag.sf.net" prefix="display"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<html>
<head>
<title>khutro.net</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="js/gen_validatorv4.js" type="text/javascript"></script>
<link href="css/userpage.css" rel="stylesheet" type="text/css">
<script src="js/jquery-1.8.2.js"></script>
<SCRIPT type="text/javascript" src="js/items.js"></SCRIPT>
<script type="text/javascript" src="js/jsondata.js"></script>
<script type="text/javascript" src="js/search.js"></script>
<script type="text/javascript" src="js/map.js"></script>
<link href="css/search.css" rel="stylesheet" type="text/css">
<link href="css/button.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script type="text/javascript"
	src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="js/scroll-startstop.events.jquery.js"
	type="text/javascript"></script>
	<script src="js/numberonly.js" type="text/javascript"></script>
<style type="text/css">
<!--
em {
	color: #999;
}

#contentmain .container2 .logincontent .logincontentmain h3 {
	color: #040406;
}

#mapdetailpost {
	width: 500px;
	height: 100%;
}
-->
</style>
<style type="text/css">
.ac_over {
	color: white; background-color:green;
}
</style>
<script
	src="https://maps.googleapis.com/maps/api/js?sensor=false&language=vi"></script>
<link href="css/info.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0"
	marginheight="0" onload="initialize3(15);">
	<form action="" id="urlpath" name="urlpath">
<input id="testurl" type="hidden" value=""/>
</form>
<script type="text/javascript">
	var path = window.location;
	urlpath.elements["testurl"].value = path;
</script>
	<s:form action="editsharetopic.action" id="editsharetopic"
		enctype="multipart/form-data" method="post" validate="true">
		<input type="hidden" name="topicId" id="topicId"
			value="${topic.getTopicId() }">
		<!-- Save for Web Slices (khutroslide.psd) -->
		<div id="header">
		<div id="headerContent">
			<a href="index.action" id="logo">khutro</a>
			<ul id="menuBar">
				<li><a href="index.action">Trang chủ</a></li>
				<li><a href="help.jsp">Trợ giúp</a></li>
				<li><a href="checkaddtopic.action">Đăng cho thuê</a>
				<li><a href="checkaddsharetopic.action">Đăng chia sẻ</a>
				<li><a href="compareresult.action">So sánh<span
						id="numberCompare" style="color: red; font-size: 12px">(${number})</span>
				</a></li>
				
			</ul>
			
			<div id="loginPanel">
				<c:choose>
					<c:when test="${displayNamess!=null}">
						<a class="profileButton" href="profileuser.action">${displayNamess}
						</a>
						<ul>
							<c:choose>
								<c:when test="${userRoleIdss==1}">
									<li><a href="adminloadsystem.action">Trang quản lý</a>
								</c:when>
							</c:choose>
							<li><a href="profileuser.action">Trang cá nhân</a></li><li><a href="changepass.jsp">Đổi mật khẩu</a>
							</li>
							<li><a href="logout.jsp">Thoát</a>
							</li>
						</ul>
					</c:when>
					<c:otherwise>
						<a class="loginButton" href="javascript:void(0);" onclick="getcurrenturlvalue();">Đăng nhập</a>
					</c:otherwise>
				</c:choose>
			</div>
			<div id="search">
			<DIV class="search-box">
			  <div style="width: 80%;float: left">
		      <INPUT id="lookup_input" class="search-bar" style="width: 220px;height: 24px;" name="keysearch" value="Tìm Kiếm ..." type="text">
		      </div>
		      <div style="width: 19%;float: right;">
		      <img alt="search" src="images/search.png" width="24" height="24" onclick="searchFull();">
		      </div>
				<SCRIPT type="text/javascript" src="js/searchfulltext.js"></SCRIPT>
		      
		      <FORM id="search-form" method="post" action="fulltextsearch.action">
		      	<INPUT id="sortby" class="search-bar" name="sortby" value="0" type="hidden">
		      </FORM>
      		</DIV>
			</div>  
		</div>
	</div>
	<script type="text/javascript">
	$('#lookup_input').bind('keypress', function(e) {
		if(e.keyCode==13){
			searchFull();
		}
	});
	</script>
		<img src="images/spacer.gif" width="1" height="56" alt="">
		<div id="editsharetopic_errorloc" class="error_strings errorcus">
			<span style="color: #F00">(Lưu ý: Những trường có dấu * là
				những trường bắt buộc.)</span>
		</div>
		<div id="contentmain">
			<div class="postcontent">

				<span
					style="text-align: center; color: #03C"><h1>Chỉnh sửa bài 
						chia sẻ</h1> </span><br/>
				<!--info cus-->
				<div style="height: 430px">
					<div id="infocus">
						<div id="info_h" style="width: 450px">
							<div id="lablecus">
								<span>Tiêu đề: </span>
							</div>
							<div id="input" style="width: 349px">

								<input type="text" name="title" id="tieude" class="tbpost1"
									value="${topic.getTitle()}">
							</div>
							<div id="checkbb">
								<span style="color: #F00">*</span>
							</div>
						</div>
						<div id="info_h">
							<div id="lablecus">
								<span>Thành phố: </span>
							</div>
							<div id="input">
								<select name="city" id="city" class="tbdownlistpost"
									onchange="initialize1(13)">
									<s:iterator value="lstProvince">
										<c:choose>
											<c:when test="${provinceTopic==provinceId}">
												<option value="${provinceId}" selected="selected">${provinceName}</option>
											</c:when>
											<c:otherwise>
												<option value="${provinceId}">${provinceName}</option>
											</c:otherwise>
										</c:choose>
									</s:iterator>
								</select>
							</div>
							<div id="checkbb">
								<span style="color: #F00">*</span>
							</div>
						</div>
						<div id="info_h">
							<div id="lablecus">
								<span>Quận/Huyện: </span>
							</div>
							<div id="input">
								<select name="district" id="district" class="tbdownlistpost"
									onchange="initialize3(15)">
									<s:iterator value="lstDistrict">
										<c:choose>
											<c:when test="${districtTopic == districtId}">
												<option value="${districtId}" selected="selected">${districtName}</option>
											</c:when>
											<c:otherwise>
												<option value="${districtId}">${districtName}</option>
											</c:otherwise>
										</c:choose>
									</s:iterator>
								</select>
							</div>
							<div id="checkbb">
								<span style="color: #F00">*</span>
							</div>
						</div>
						<div id="info_h" style="width: 450px">
							<div id="lablecus">
								<span>Địa chỉ: </span>
							</div>
							<div id="input" style="width: 349px">
								<input type="text" name="address" id="address1" class="tbpost1"
									value="${topic.getAddress()}">
							</div>
							<div id="checkbb">
								<span style="color: #F00">*</span>
							</div>
						</div>
						<div id="info_h" style="width: 400px">
							<div id="lablecus">
								<span>Giá: </span>
							</div>
							<div id="input">
								<input type="text" name="price" id="price" class="tbpost1"
									value="${topic.getPrice()}" onkeydown="return jsDecimals(event);">
							</div>
							<script type="text/javascript">
									$('#price').keyup(function() {
										var keyword = $(this).val();
										$('#Gia').html(keyword);
									});
									$("#price").attr("maxlength", 4);
							</script>
							<div id="checkbb">
								<span style="color: #F00">*</span>
							</div>
							<div id="areacus" style="float: left; font: 12px Arial, Geneva, sans-serif; padding-top: 5px">
								<span id="Gia" style="color:red;">${topic.getPrice()}</span> triệu vnđ</div>
						</div>
						<div id="info_h" style="width: 400px">
							<div id="lablecus">
								<span>Diện tích: </span>
							</div>
							<div id="input">
								<input type="text" name="area" id="area" class="tbpost1"
									value="${topic.getArea()}" onkeydown="return jsDecimals(event);">
							</div>
							<script type="text/javascript">
							$('#area').keyup(function() {
								var keyword = $(this).val();
								$('#dientich').html(keyword);
							});
							$("#area").attr("maxlength", 4);
							</script>
							<div id="checkbb">
								<span style="color: #F00">*</span>
							</div>
							<div id="areacus" style="float: left; font: 12px Arial, Geneva, sans-serif; padding-top: 5px">
								<span id="dientich" style="color:red;">${topic.getArea()}</span> m2</div>
						</div>

						<div id="info_h">
							<div id="lablecus">
								<span>Vệ sinh: </span>
							</div>
							<c:choose>
								<c:when test="${topic.getToilet()==1 }">
									<div id="input">
										<select name="toilet" id="toilet" class="tbdownlistpost">
											<option selected value="1">Riêng</option>
											<option value="0">Chung</option>
										</select>
									</div>
								</c:when>
								<c:otherwise>
									<div id="input">
										<select name="toilet" id="toilet" class="tbdownlistpost">
											<option value="1">Riêng</option>
											<option selected value="0">Chung</option>
										</select>
									</div>
								</c:otherwise>
							</c:choose>
							<div id="checkbb">
								<span style="color: #F00">*</span>
							</div>
						</div>
						<div id="info_h">
							<div id="lablecus">
								<span>Loại nhà: </span>
							</div>
							<c:choose>
								<c:when test="${topic.getHouseType()==1 }">
									<div id="input">
										<select name="houseType" id="houseType" class="tbdownlistpost">
											<option selected value="1">Không chung chủ</option>
											<option value="0">Chung chủ</option>
										</select>
									</div>
								</c:when>
								<c:otherwise>
									<div id="input">
										<select name="houseType" id="houseType" class="tbdownlistpost">
											<option value="1">Không chung chủ</option>
											<option selected value="0">Chung chủ</option>
										</select>
									</div>
								</c:otherwise>
							</c:choose>
							<div id="checkbb">
								<span style="color: #F00">*</span>
							</div>
						</div>

						<div id="info_h">
							<div id="lablecus">
								<span>Liên hệ: </span>
							</div>
							<div id="input">
								<input type="text" name="contact" id="contact" class="tbpost1"
									value="${topic.getContact() }">
							</div>
							<div id="checkbb">
								<span style="color: #F00">*</span>
							</div>
						</div>
						<div id="info_h">
							<div id="lablecus">
								<span>Điện thoại: </span>
							</div>
							<div id="input">
								<input type="text" name="phone" id="phone" class="tbpost1"
									value="${topic.getPhone() }" onkeydown="return jsDecimals(event);">
							</div>
							<div id="checkbb">
								<span style="color: #F00">*</span>
							</div>
						</div>
						<div id="info_h" style="width: 450px">
							<div id="lablecus">
								<span>Upload ảnh: </span>
							</div>
							<div id="input" style="width: 260px">
								<input type="file" name="imageTopic" id="imageTopic"
									multiple="multiple" id="image" class="tbpost1"
									onchange="uploadchange();">
							</div>
							<div id="checkbb"
								style="width: 179px; color: red; font: normal 8px"></div>
						</div>
						<div id="info_h" style="width: 450px">
							<div id="lablecus"></div>
                            <div id="input" style="width: 200px;color: black; font: italic 50px ;">
								<span style="height: 49%">Dung lượng &lt;2Mb,tối đa 10 ảnh</span>
								<!--uploaded img-->
							</div>
							<div id="input"
								style="width: 439px; overflow: hidden; height: 100px;">
								<!--uploaded img-->
								<div id="input1"
									style="width: 400px; color: red; font: normal 8px">
									<span style="height: 49%">Bạn muốn xóa ảnh nào thì nhấn
										vào ảnh đó !</span>
								</div>
								<div id="imagechange">
									<s:iterator value="lstimages" status="status">
										<a href="javascript:void(0);"
											onclick="delImg(<s:property value="lstimages[#status.index][0]" />,<s:property value="lstimages[#status.index][1]" />);"><img
											src="Img/Topic/<s:property value="lstimages[#status.index][2]" />"
											width="35" height="35" /> </a>

									</s:iterator>
								</div>
							</div>

						</div>
						<input type="hidden" id="latitude" name="latitude"
							value="${topic.getLatitude()}"> <input type="hidden"
							id="longitude" name="longitude" value="${topic.getLongitude()}">
					</div>
					<!--map cus-->
					<div id="mapdetailpost"></div>
				</div>
				<script type="text/javascript">
						
							$("#contact").attr("maxlength", 45);
							$("#phone").attr("maxlength", 11);
							</script>
				<!--end info-->
				<div id="info_h1">
				<div id="lablecus1">
								<span>Thông tin thêm : </span>
							</div>
							</div>
				<div class="description">
					<textarea style="font: 14px Arial, Geneva, sans-serif; color: #000" name="description " id="styled">${topic.getDescription() }</textarea>
				</div>
				<div class="summit" style="padding-left: 40%">
					<button class="buttonpost" type="reset" name="submit" style="width: 120px; height: 30px;" onclick="window.location.href = 'index.action';">Huỷ</button>
					<button class="buttonpost" type="submit" name="submit" style="width: 120px; height: 30px;">Lưu
						lại</button>

				</div>
			</div>
		</div>
		<div id="footercus" style="text-align: center;">
		Designed by FU team | Powered by Struts<br> khutro.net

	</div>
		<input type="hidden" name="postfbwall" value="postfbwall" />
		<!-- End Save for Web Slices -->
		<div style="display: none;" class="nav_up" id="nav_up"></div>
		<div style="display: none;" class="nav_down" id="nav_down"></div>
		<script>
		jQuery(function() {
			var $elem = $('#contentmain');

			jQuery('#nav_up').fadeIn('slow');
			jQuery('#nav_down').fadeIn('slow');

			jQuery(window).bind('scrollstart', function() {
				$('#nav_up,#nav_down').stop().animate({
					'opacity' : '0.2'
				});
			});
			jQuery(window).bind('scrollstop', function() {
				$('#nav_up,#nav_down').stop().animate({
					'opacity' : '1'
				});
			});

			jQuery('#nav_down').click(function(e) {
				$('html, body').animate({
					scrollTop : $elem.height()
				}, 800);
			});
			jQuery('#nav_up').click(function(e) {
				$('html, body').animate({
					scrollTop : '0px'
				}, 800);
			});
		});
	</script>
	</s:form>
	<script type="text/javascript">
		function uploadchange() {
			var files = $('input[type="file"]')[0].files;
			var notok=0;
			var i=0;
			for(i=0;i<files.length;i++){
				if(files[i].size>2097152){
					notok=1;
				}
				if(notok==1){
					$('#imageTopic').val("");
					alert("ảnh phải nhỏ hơn 2Mb");
				}
			}
			if (files.length > 10) {
				$('#imageTopic').val("");
				alert("Bạn chỉ được up tối đa 10 ảnh và ảnh phải nhỏ hơn 2Mb");

			}

		}
	</script>
	<script language="JavaScript" type="text/javascript"
		xml:space="preserve">
		//         
		var frmvalidator = new Validator("editsharetopic");
		frmvalidator.EnableOnPageErrorDisplaySingleBox();
		frmvalidator.EnableMsgsTogether();

		frmvalidator.addValidation("tieude", "req",
		"+ Tiêu đề không được trống");
		frmvalidator.addValidation("tieude", "maxlen=300",
		"Độ dài tối đa tiêu đề là 300 kí tự");
		frmvalidator.addValidation("latitude", "req",
		"+ Lựa chọn vị trí trên bản đồ");
		frmvalidator.addValidation("city", "dontselect=0",
				"+ Lựa chọn thành phố");
		frmvalidator.addValidation("district", "dontselect=0",
				"+ Lựa chọn quận/huyện");
		frmvalidator.addValidation("address", "req",
				"+ Địa chỉ không được trống");
		frmvalidator.addValidation("price", "req", "+ Giá không được trống");
		frmvalidator.addValidation("price", "numeric", "+ Giá hãy nhập số");
		frmvalidator.addValidation("area", "req", "+ Diện tích không được trống");
		frmvalidator.addValidation("area", "numeric", "+ Diện tích hãy nhập số");
		frmvalidator.addValidation("contact", "req","+ Liên hệ không được trống");
		frmvalidator.addValidation("phone", "req", "+ Số điện thoại không được trống");
		frmvalidator.addValidation("phone", "numeric",
				"+ Số điện thoại phải là số");
		frmvalidator.addValidation("phone", "maxlen=11",
		"+ Số điện thoại tối đa 11");
		frmvalidator.addValidation("imageTopic", "file_extn=jpg;jpeg;png",
				"+ File ảnh chỉ chấp nhận : jpg,jpeg,png");

		//
	</script>
</body>
</html>